<!-- 设置 -->
<template>
	<view class="page-content">
		<view style="position: fixed;bottom: 0;left: 0;right: 0;width: 100%; height:100%;z-index: -1;">
			<image src="https://duomi.bigchun.com/images/discount_bg.png" style="width: 100%;height: 100%;"></image>
		</view>
		<view class="select-box" @click="show = true">
			{{store}}
		</view>
		<u-select v-model="show" :list="list" value-name="id" label-name="shop_name" @confirm="confirm"></u-select>
		<view class="title">
			调整店铺的折扣
		</view>
		<view class="card">
			<image src="../../static/images/icons/discount_card.png"></image>
			<view class="card-time">
				当前
			</view>
			<view class="card-num">
				<text>{{discountOld}}</text>
				<text>折</text>
			</view>
		</view>
		<view class="edit">
			<text>调整为</text>
			<view class="input-box">
				<input type="text" v-model="discount" :border="false" :clearable="false" placeholder=" " maxlength="3" :custom-style="customStyle" />
			</view>
			<text>折</text>
		</view>
		<view class="button" @click="setDiscount">
			确认调整
		</view>
		<u-toast ref="uToast" />
<!--		&lt;!&ndash; 登录提示 &ndash;&gt;-->
<!--		<shopro-auth-modal></shopro-auth-modal>-->
	</view>
</template>

<script>
	import {
		mapState,
		mapActions,
		mapGetters
	} from 'vuex';
	export default {
		components: {},
		data() {
			return {
				id:'',
				discount:'',
				olddDscount:'',
				customStyle:{
					color:'#fff',
					fontSize:'40rpx',
					textAlign:'center'
				},
				store:'请选择店铺',
				show:false,
				list:[],
				discountOld:''

			};
		},
		computed: {
			...mapGetters(['initShop'])
		},
		onShow() {
			this.getStoreAddress();
		},
		methods: {
			// 获取门店列表
			getStoreAddress() {
				this.$http_business('store.listNoPage',).then(res => {
					if (res.code == 1) {
						this.list = res.data
					}
				});
			},
			confirm(e){
				console.log(e)
				var that = this;
				that.store = e[0].label;
				that.id = e[0].value;
				for(var i = 0;i < that.list.length;i++ ){
					if(that.list[i].id == that.id){
						that.discountOld = that.list[i].discount;
					}
				}
			},
			setDiscount(){
				let that = this;
				if (!that.store) {
					this.$u.toast('请选择店铺');
					return;
				}
				if (!that.discount) {
					this.$u.toast('请输入要设置的折扣');
					return;
				}
				let params = {
					discount:that.discount,
					id:that.id
				};
				that.$http_business('store.setDiscount',params).then(res => {
					if (res.code == 1) {
						that.$u.toast('设置成功');
						that.discountOld = that.discount;
						that.discount = '';
            that.getStoreAddress();
					}
					else{
						that.$u.toast(res.msg);
					}
				})
			}
		}

	};
</script>

<style lang="scss">
	.page-content {
		// height: 100vh;
		height:  calc( 100vh - var(--status-bar-height) );;
		text-align: center;
		padding-top: 80rpx;
		display: flex;
		flex-direction: column;
	}
	.select-box{
		width: fit-content;
		border: 1px solid #EEEEEE;
		text-align: center;
		color: #fff;
		padding: 10rpx 20rpx;
		margin: 0 auto;
		margin-bottom: 100rpx;

	}
	.title{
		font-size: 60rpx;
		font-family: PingFangSC-Medium, PingFang SC;
		font-weight: 500;
		color: #FFFFFF;

	}
	.card{
		margin-top: 88rpx;
		position: relative;
		image{
			width: 236rpx;
			height: 224rpx;
		}
		.card-time{
			position: absolute;
			top: 12rpx;
			left: 46.5%;
			font-size: 24rpx;
			font-family: PingFangSC-Regular, PingFang SC;
			font-weight: 400;
			color: #F5834B;
			z-index: 22;
		}
		.card-num{
			width: 236rpx;
			position: absolute;
			top: 45rpx;
			left: 34.5%;
		}
		.card-num text:first-child{
			font-size: 110rpx;
			font-family: PingFangSC-Medium, PingFang SC;
			font-weight: 500;
			color: #FFFFFF;
		}
		.card-num text:last-child{
			font-size: 26rpx;
			font-family: PingFangSC-Regular, PingFang SC;
			font-weight: 400;
			color: #FFFFFF;
		}
	}
	.edit{
		display: flex;
		align-items: center;
		font-size: 32rpx;
		font-family: PingFangSC-Regular, PingFang SC;
		font-weight: 400;
		color: #FFFFFF;
		text-align: center;
		margin: 80rpx 0 0 35%;
		.input-box{
			width: 90rpx;
			border-bottom: 2rpx solid #fff;
			margin: 0 4rpx;

		}
	}
	.button{
		font-size: 32rpx;
		font-family: PingFangSC-Regular, PingFang SC;
		font-weight: 400;
		color: #FC5351;
		width: 298rpx;
		height: 88rpx;
		line-height:88rpx;
		background: #FFFFFF;
		border-radius: 44rpx;
		margin:100rpx auto;
	}
</style>
